<template>
  <div class="app">
    <AssemBly :data="list">
      <template #header><p>本周热搜 TOP5</p></template>
    </AssemBly>
    <AssemBly :data="list2">
      <template #header>
        <p>可能感兴趣的人</p>
        <button><span>〇</span>换一批</button>
      </template>
    </AssemBly>
    <!--  -->
    <!-- <div class="top5">
      <div class="five">
        <p>本周热搜 TOP5</p>
      </div>
      <div class="content">
        <ul>
          <li>
            <P>#区块链</P>
            <P>
              <span>火</span>
              <span>96</span>
            </P>
          </li>
        </ul>
      </div>
    </div> -->
  </div>
</template>

<script>
import AssemBly from "./components/AssemBly.vue";
export default {
  components: {
    AssemBly,
  },
  data() {
    return {
      list: [
        {
          id: 1,
          name: "#区块链",
          num: 96,
        },
        {
          id: 2,
          name: "#数据挖掘",
          num: 91,
        },
        {
          id: 3,
          name: "#无人机",
          num: 87,
        },
        {
          id: 4,
          name: "#生命科学",
          num: 72,
        },
        {
          id: 5,
          name: "#传感器",
          num: 60,
        },
      ],
      list2: [
        {
          id: 1,
          name: "李国胜",
          age: 52,
          area: "研究领域：机电一体化",
          school: "哈尔滨工业大学·教授",
          sex: "♂",
        },
        {
          id: 1,
          name: "李国胜",
          age: 36,
          area: "研究领域：人工智能",
          school: "清华大学·副教授",
          sex: "♀",
        },
      ],
    };
  },
};
</script>

<style lang="less">
* {
  margin: 0 auto;
  padding: 0;
  // text-align: center;
}

.app {
  height: 900px;
  background-color: #f2f2f2;
}
</style>
